<template>
    <div>
        业务类型：
        <el-select v-model="path" placeholder="应收转应收" style="width: 120px;" @change="goto">
            <el-option value="WriteOff">
                预收冲应收
            </el-option>
            <el-option value="WriteOff2">
                预付冲应付
            </el-option>
            <el-option value="WriteOff3">
                应收冲应付
            </el-option>
            <el-option value="WriteOff4">
                应收转应收
            </el-option>
            <el-option value="WriteOff5">
                应付转应付
            </el-option>
        </el-select>
        转出客户：
<<<<<<< HEAD
        <el-input style="width: 150px;margin-left: 10px;margin-right: 20px;" placeholder="请输入客户编号"
            v-model="customerName1" clearable>
=======
        <el-input style="width: 150px;margin-left: 10px;margin-right: 20px;" placeholder="请输入客户编号" v-model="input"
            clearable>
>>>>>>> 6be95d2b3200ab6fbb17d1e0a5a9b367f780cc8e
        </el-input>
        <el-button slot="reference" style="margin-left:-20px;margin-right:10px"
            @click="dialogFormVisible = true">...</el-button>
        转入客户：
<<<<<<< HEAD
        <el-input style="width: 150px;margin-left: 10px;margin-right: 20px;" placeholder="请输入客户编号"
            v-model="customerName2" clearable>
        </el-input>
        <el-button slot="reference" style="margin-left:-20px;margin-right:10px"
            @click="dialogFormVisible1 = true">...</el-button>
        <el-dialog top="20px" title="选择客户" :visible.sync="dialogFormVisible">
            <ClientChoose ref="clientChoose" />
            <div slot="footer" class="dialog-footer">
                <el-button @click="dialogFormVisible = false">取 消</el-button>
                <el-button type="primary" @click="dialogFormVisibl()">确 定</el-button>
            </div>
        </el-dialog>
        <el-dialog top="20px" title="选择客户" :visible.sync="dialogFormVisible1">
            <ClientChoose ref="clientChoose" />
            <div slot="footer" class="dialog-footer">
                <el-button @click="dialogFormVisible1 = false">取 消</el-button>
                <el-button type="primary" @click="dialogFormVisible2()">确 定</el-button>
            </div>
        </el-dialog>
        <span class="demonstration" style="margin-left: 20px;">单据日期:</span>
        <el-date-picker v-model="selectedDate" align="right" type="date" placeholder="选择日期"
            :picker-options="pickerOptions" @change="handleDateChange" style="margin-left: 10px;"></el-date-picker>
        <div style="margin-top: 10px;">
            转出客户业务员：
            <el-select v-model="value" placeholder="业务员" style="width: 100px;margin-right: 20px;">
                <el-option v-for="item in yList" :key="item.value" :label="item.label" :value="item.value">
=======
        <el-input style="width: 150px;margin-left: 10px;margin-right: 20px;" placeholder="请输入客户编号" v-model="input"
            clearable>
        </el-input>
        <el-button slot="reference" style="margin-left:-20px;margin-right:10px"
            @click="dialogFormVisible = true">...</el-button>
        <el-dialog top="20px" title="" :visible.sync="dialogFormVisible">
            <el-select v-model="value" placeholder="类别">
                <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
                </el-option>
            </el-select>
            <el-input v-model="input" placeholder="请输入内容" style="width: 200px;margin-left: 20px;"></el-input>
            <el-checkbox v-model="checked" style="margin-left: 20px">显示禁用客户</el-checkbox>
            <el-button type="primary" style="margin-left: 20px">查询</el-button>
            <el-table :data="gridData">

                <el-table-column type="selection" width="55">
                </el-table-column>
                <el-table-column width="100" property="name" label="类别"></el-table-column>
                <el-table-column width="100" property="address" label="编号"></el-table-column>
                <el-table-column width="300" property="address" label="名称"></el-table-column>
                <el-table-column width="100" property="address" label="联系人"></el-table-column>
                <el-table-column width="100" property="address" label="手机"></el-table-column>
                <el-table-column width="100" property="address" label="备注"></el-table-column>
            </el-table>
            <div class="block">
                <span class="demonstration"></span>
                <el-pagination layout="prev, pager, next" :total="1000">
                </el-pagination>
            </div>
            <div slot="footer" class="dialog-footer">
                <el-button @click="dialogFormVisible = false">取 消</el-button>
                <el-button type="primary" @click="dialogFormVisible = false">确 定</el-button>
            </div>
        </el-dialog>

        <span class="demonstration" style="margin-left: 20px;">单据日期:</span>
        <el-date-picker v-model="value2" align="right" type="date" placeholder="选择日期" :picker-options="pickerOptions"
            style="width: 120px;">
        </el-date-picker>
        <div style="margin-top: 10px;">
            转出客户业务员：
            <el-select v-model="value" placeholder="业务员" style="width: 100px;margin-right: 20px;">
                <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
>>>>>>> 6be95d2b3200ab6fbb17d1e0a5a9b367f780cc8e
                </el-option>
            </el-select>
            转入客户业务员：
            <el-select v-model="value" placeholder="业务员" style="width: 100px;">
<<<<<<< HEAD
                <el-option v-for="item in yList" :key="item.value" :label="item.label" :value="item.value">
=======
                <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
>>>>>>> 6be95d2b3200ab6fbb17d1e0a5a9b367f780cc8e
                </el-option>
            </el-select>
        </div>
        <div style="float: right; margin-top: -40px;">
            <i class="el-icon-paperclip" style="color: blue;margin-left: 40px"></i>
            <sapn style="color: blue;">上传附件</sapn>
            <span style="margin-left: 10px;">单据编号:</span>
<<<<<<< HEAD
            <el-input style="width: 120px;margin-left: 10px;margin-right: 20px;" placeholder="" clearable disabled>
=======
            <el-input style="width: 120px;margin-left: 10px;margin-right: 20px;" placeholder="" v-model="input"
                clearable disabled>
>>>>>>> 6be95d2b3200ab6fbb17d1e0a5a9b367f780cc8e
            </el-input>
            <el-dropdown>
                <span class="el-dropdown-link">
                    <i class="el-icon-edit"></i>
                </span>
                <el-dropdown-menu slot="dropdown">
                    <el-dropdown-item>SKDYYYYMMDD</el-dropdown-item>
                    <el-dropdown-item>狮子头</el-dropdown-item>
                    <el-dropdown-item>螺蛳粉</el-dropdown-item>
                    <el-dropdown-item disabled>双皮奶</el-dropdown-item>
                    <el-dropdown-item divided>蚵仔煎</el-dropdown-item>
                </el-dropdown-menu>
            </el-dropdown>
        </div>
        <hr style="margin-top: 10px">
        <div style="margin-top: 10px;float: right">
            <el-button>保存</el-button><el-button type="primary">提交</el-button>
        </div>
        <div style="clear: both;"></div>
        <div style="clear: both"></div>
        <div style="float:right;margin-top: 10px;margin-left: 200px"> <el-button
<<<<<<< HEAD
                @click="chooseInitForm">选择应收单据</el-button>
        </div>
        <div style="clear: both;"></div>
        <el-dialog top="20px" title="" :visible.sync="choose" style="margin-top: 10px">
            <ShouldForm :customerNum="receipt.customerCode1" ref="shouldForm" />
            <div slot="footer" class="dialog-footer">
                <el-button @click="choose = false">取 消</el-button>
                <el-button type="primary" @click="yesForm()">确 定</el-button>
            </div>
        </el-dialog>
        <el-table height="180px" :data="formDate" border style="width: 100%; font-size: 13px">
            <el-table-column fixed prop="" label="" width="50">
                <i class="el-icon-circle-plus-outline" style="margin-left: 8px;" @click="addRow1()"></i>
                <br>
                <i class="el-icon-remove-outline" style="margin-left: 8px;"></i>
            </el-table-column>
            <el-table-column prop="documentNum" label="源单编号" width="150">
            </el-table-column>
            <el-table-column prop="saleType" label="业务类别" width="120">
            </el-table-column>
            <el-table-column prop="documentDate" label="单据日期" width="120">
            </el-table-column>
            <el-table-column prop="received" label="单据金额" width="120">
            </el-table-column>
            <el-table-column prop="writtenOffMoney" label="已核销金额" width="120">
            </el-table-column>
            <el-table-column prop="noMoney" label="未核销金额" width="120">
            </el-table-column>
            <el-table-column prop="nowMoney" label="本次核销金额" width="130">
                <template slot-scope="scope">
                    <el-input v-model="scope.row.nowMoney" style="width: 100px;margin-left: 10px;margin-right: 20px;"
                        placeholder="收款金额" clearable>
                    </el-input>
                </template>
            </el-table-column>
            <el-table-column prop="zip" label="单据备注" width="120">
            </el-table-column>
        </el-table>


        <div style="width: 100%;background-color: blanchedalmond;height: 30px;">
            <table style="width: 78.7%;height: 30px;">
                <tr>
                    <td style="width: 50%;">合计：</td>
                    <td style="width: 50%;">123</td>
                </tr>
            </table>
        </div>

        <el-input type="textarea" :rows="2" placeholder="暂无备注信息" v-model="receipt.remark"
=======
                @click="choose1 = true">选择应收单据</el-button>
        </div>
        <div style="clear: both;"></div>
        <el-dialog top="20px" title="" :visible.sync="choose1" style="margin-top: 10px">
            <div class="block">
                <span class="demonstration">日期：</span>
                <el-date-picker v-model="value2" type="daterange" align="right" unlink-panels range-separator="至"
                    start-placeholder="开始日期" end-placeholder="结束日期" :picker-options="pickerOptions"
                    style="width: 200px">
                </el-date-picker>
                备注：
                <el-input style="width: 100px; margin-left: 10px; margin-right: 20px" placeholder="备注" v-model="input"
                    clearable>
                </el-input>
                源单编号：
                <el-input style="width: 110px; margin-left: 10px; margin-right: 20px" placeholder="源单编号："
                    v-model="input" clearable>
                </el-input>
                <el-button type="primary" style="margin-left: 20px">查询</el-button>
            </div>

            <el-table :data="gridData">
                <el-table-column type="selection" width="55"> </el-table-column>
                <el-table-column prop="name" label="源单编号" width="120">
                </el-table-column>
                <el-table-column prop="address" label="业务类别" width="120">
                </el-table-column>
                <el-table-column fixed prop="name" label="单据日期" width="150">
                </el-table-column>
                <el-table-column prop="address" label="单据金额" width="120">
                </el-table-column>
                <el-table-column prop="name" label="已核销金额" width="120">
                </el-table-column>
                <el-table-column prop="address" label="未核销金额" width="120">
                </el-table-column>

                <el-table-column prop="address" label="业务员" width="120">
                </el-table-column>
                <el-table-column prop="address" label="备注" width="120">
                </el-table-column>
            </el-table>
            <div class="block">
                <span class="demonstration"></span>
                <el-pagination layout="prev, pager, next" :total="1000">
                </el-pagination>
            </div>
            <div slot="footer" class="dialog-footer">
                <el-button @click="choose = false">取 消</el-button>
                <el-button type="primary" @click="choose = false">确 定</el-button>
            </div>
        </el-dialog>
        <Top style="margin-top:0px" />

        <el-input type="textarea" :rows="2" placeholder="暂无备注信息" v-model="textarea"
>>>>>>> 6be95d2b3200ab6fbb17d1e0a5a9b367f780cc8e
            style="width: 100%;line-height: 20px;">

        </el-input>
        <div style="float:right;margin-right: 20px;margin-top: 10px;">
            <el-button @click="goto('WriteOffHistory')">历史单据</el-button><el-button>操作日志</el-button>
        </div>

    </div>

</template>

<script>
<<<<<<< HEAD
import ClientChoose from '../public_com/ClientChoose.vue';
import ShouldForm from './ShouldForm.vue';
=======
>>>>>>> 6be95d2b3200ab6fbb17d1e0a5a9b367f780cc8e
import Top from './Top.vue';

export default {
    name: "WriteOff",
    components:
    {
<<<<<<< HEAD
        Top,
        ClientChoose,
        ShouldForm
    },
    data() {
        return {
            yList: "",
            selectedDate: "",
            dialogFormVisible1: false,
=======
        Top
    },
    data() {
        return {
>>>>>>> 6be95d2b3200ab6fbb17d1e0a5a9b367f780cc8e
            dialogFormVisible: false,
            choose: false,
            choose1: false,
            path: "",
<<<<<<< HEAD
            customerId1: "",
            customerName1: "",
            customerType1: "",
            customerId2: "",
            customerName2: "",
            customerType2: "",
=======
            options: [{
                value: '选项1',
                label: '黄金糕'
            }, {
                value: '选项2',
                label: '双皮奶'
            }, {
                value: '选项3',
                label: '蚵仔煎'
            }, {
                value: '选项4',
                label: '龙须面'
            }, {
                value: '选项5',
                label: '北京烤鸭'
            }],
            gridData: [{
                date: '2016-05-02',
                name: '王小虎',
                address: '上海市普陀区金沙江路 1518 弄'
            }, {
                date: '2016-05-04',
                name: '王小虎',
                address: '上海市普陀区金沙江路 1518 弄'
            }, {
                date: '2016-05-01',
                name: '王小虎',
                address: '上海市普陀区金沙江路 1518 弄'
            }, {
                date: '2016-05-03',
                name: '王小虎',
                address: '上海市普陀区金沙江路 1518 弄'
            }],
>>>>>>> 6be95d2b3200ab6fbb17d1e0a5a9b367f780cc8e
            pickerOptions: {
                disabledDate(time) {
                    return time.getTime() > Date.now();
                },
                shortcuts: [{
                    text: '今天',
                    onClick(picker) {
                        picker.$emit('pick', new Date());
                    }
                }, {
                    text: '昨天',
                    onClick(picker) {
                        const date = new Date();
                        date.setTime(date.getTime() - 3600 * 1000 * 24);
                        picker.$emit('pick', date);
                    }
                }, {
                    text: '一周前',
                    onClick(picker) {
                        const date = new Date();
                        date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
                        picker.$emit('pick', date);
                    }
                }]
            },
<<<<<<< HEAD
            receipt: {
                customerCode1: "",
                customerCode2: "",
                doId: 1,
                id: "",
                writeoffMoney: "",
            },
            formDate: [
                {
                    documentNum: "",
                    documentDate: "",
                    received: "",
                    writtenOffMoney: 0,
                    remark: "",
                    noMoney: 0,
                    nowMoney: 0,
                    saleType: ""
                },

            ],
=======
            tableData: [{
                date: '2016-05-02',
                name: '王小虎',
                province: '上海',
                city: '普陀区',
                address: '上海市普陀区金沙江路 1518 弄',
                zip: '200333'
            }, {
                date: '2016-05-04',
                name: '王小虎',
                province: '上海',
                city: '普陀区',
                address: '上海市普陀区金沙江路 1517 弄',
                zip: '200333'
            }, {
                date: '2016-05-01',
                name: '王小虎',
                province: '上海',
                city: '普陀区',
                address: '上海市普陀区金沙江路 1519 弄',
                zip: '200333'
            }, {
                date: '2016-05-03',
                name: '王小虎',
                province: '上海',
                city: '普陀区',
                address: '上海市普陀区金沙江路 1516 弄',
                zip: '200333'
            }],

>>>>>>> 6be95d2b3200ab6fbb17d1e0a5a9b367f780cc8e
            value1: '',
            value2: '',
        };
    },
    methods: {
<<<<<<< HEAD
        handleDateChange(value) {
            // value 即为选中的日期值
            console.log('选中的日期是：', value);
            this.receipt.orderDate = value
            // 在这里可以执行更多的逻辑，比如更新数据、调用 API 等
        },
        yesForm() {
            this.choose = false
            // this.goodsList = 
            // console.log(this.goodsList)
            //遍历商品列表
            this.formDate = this.$refs.shouldForm.selectionList
            console.log(this.$refs.shouldForm.selectionList)
        },
        dialogFormVisible2: function () {
            this.dialogFormVisible1 = false
            const id = this.$refs.clientChoose.clientId
            this.customerId2 = id
            this.receipt.customerCode2 = this.$refs.clientChoose.clientCode
            // console.log(this.$refs.clientChoose.clientName)
            // this.receipt.customerCode = this.$refs.clientChoose.clientCode
            // console.log(this.receipt.customerCode)
            this.customerName2 = this.$refs.clientChoose.clientName
        },
        dialogFormVisibl: function () {
            this.dialogFormVisible = false
            // alert("1")
            const id = this.$refs.clientChoose.clientId
            this.customerId1 = id
            this.receipt.customerCode1 = this.$refs.clientChoose.clientCode
            // console.log(this.$refs.clientChoose.clientName)
            // this.receipt.customerCode = this.$refs.clientChoose.clientCode
            // console.log(this.receipt.customerCode)
            this.customerName1 = this.$refs.clientChoose.clientName
            // console.log(this.receipt.customerId)
        },
        chooseInitForm: function () {
            if (this.receipt.customerName1 === "") {
                alert("请选择转出客户")
            } else {
                this.choose = true
            }
        },
=======
>>>>>>> 6be95d2b3200ab6fbb17d1e0a5a9b367f780cc8e
        goto() {
            this.$router.push(this.path)
        },
        goto(to) {
            this.$router.push(to)
        }
    }

}
</script>

<style></style>